<template>
<view>
<!-- 5 -->
<!-- 12 -->
<!-- 7 -->
<!-- 8 -->
<!-- 6 -->
<!-- 3 -->
<!-- 9 -->
<!--13 tab -->
<!-- <import src="../../view/partials/footer_tab.wxml"/> --><!-- 9 -->


<!-- user_center_top_image -->
<!-- user_center_order -->
<!-- user_center_order -->


<!-- 
方法1：把所有的组件都导入进来，然后根据传过来的partials规则里面的排序来渲染组件 
<template is="{{index%2 === 0 ? 'courseLeft' : 'courseRight'}}" data="{{...item}}"></template>
-->
<view class="container">
  <block v-for="(item, temp) in PaiXuPartials" :key="temp">
    <!-- <template is="{{item.partialType}}" 
       data="{{...item.jsonData}}"></template>
 -->
        <!--uni-app不支持动态组件，因此注释下行代码。请手动修改为显式声明组件<component error-data="...componentData,...item.jsonData,setting,...upData" :is="!!item.androidTemplate ? item.androidTemplate : item.partialType"></component>--> 
  </block>
</view>
<view v-if="!tabData">
    <view class="noNews">没有相关新闻</view>
  </view>
<view v-else class="ListDataContainer">
  
  <view class="ListDataItem" v-for="(list, index) in tabData" :key="index" :data-id="list.id" @tap="toNewsDetail">
    <view class="ListDataItemWord"> 
      <text class="lineheight_title font_1">{{list.title}}</text>
      <text class="word2 font_08">{{list.description}} </text> 
    </view>
     <view v-if="list.imagePath" class="ListDataItemImage"><image mode="aspectFill" :src="list.imagePath + '?x-oss-process=style/preview'"></image></view> 
  </view>
 
</view>
</view>
</template>

<script>
// import { json2Form } from "../../static/public/json2Form";
// var tab = require("../../view/js/tab.js");

export default {
  data() {
    return {
      /* seeting */
      setting: null,
      userData: null,
      PaiXuPartials: null,
      loginUser: null,
      showState: null,
      tabData: [],
      componentData: {},
      sysWidth: 320,
      listPage: {
        page: 1,
        pageSize: 0,
        totalSize: 0,
        curpage: 1
      }
    };
  },

  components: {},
  props: {},
  onLoad: function (options) {
    console.log("======options=====", options);
    this.getNewsData(options); // this.getCusPage();

    this.opt = options;

    if (options.pageNage) {
      wx.setNavigationBarTitle({
        title: options.pageNage
      });
    }

    this.setData({
      setting: getApp().globalData.setting,
      sysWidth: getApp().globalData.sysWidth
    });
    console.log(this.sysWidth);
  },
  onReady: function () {
    var that = this;
    let componentData = this.componentData;
  },
  onShow: function () {
    this.setData({
      loginUser: getApp().globalData.loginUser
    });
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    let that=this;
    that.listPage.page=1
    that.getNewsData(this.opt)
    wx.stopPullDownRefresh();
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    var that = this;

    if (that.listPage.totalSize > that.listPage.curPage * that.listPage.pageSize) {
      that.listPage.page++;
      this.getNewsData(this.opt);
    }
  },
  methods: {
    bindTab: function (e) {
      let that = this;
      let url = e.currentTarget.dataset.url;
      let componentData = this.componentData;
      tab.bindTap(url, that, json2Form, app, componentData);
    },
    toNewsDetail: function (e) {
      let id = e.currentTarget.dataset.id;
      let url='news_detail.html?id=' + id
       getApp().globalData.linkEvent(url)
    },

    /*  */
    getCusPage: function () {
      var customIndex = getApp().globalData.AddClientUrl("/custom_page_news.html");
      var that = this; //拿custom_page

      wx.request({
        url: customIndex.url,
        header: getApp().globalData.header,
        success: function (res) {
          console.log(res.data);
          that.setData({
            userData: res.data
          });

          if (!!res.data.partials && res.data.partials.length > 0) {
            that.getPartials();
          }
        },
        fail: function (res) {
          //app.loadFail()
          that.setData({
            PaiXuPartials: []
          });
        }
      });
    },

    /* 格式化数据 */
    getPartials: function () {
      var that = this;
      var partials = this.userData.partials;
      var PaiXuPartials = []; //排序

      for (let i = 0; i < partials.length; i++) {
        if (typeof partials[i].jsonData == "string") {
          partials[i].jsonData = JSON.parse(partials[i].jsonData);
        }

        if (partials[i].partialType == 13) {
          let componentData = that.componentData;
          tab.tab(that, partials[i], json2Form, app, componentData);
        }

        if (partials[i].partialType == 12) {
          wx.setNavigationBarTitle({
            title: partials[i].jsonData.title
          });

          if (!partials[i].jsonData.titleColor) {
            partials[i].jsonData.titleColor = '#000000';
          }

          if (!partials[i].jsonData.bgColor) {
            partials[i].jsonData.bgColor = '#ffffff';
          }

          wx.setNavigationBarColor({
            frontColor: partials[i].jsonData.titleColor,
            backgroundColor: partials[i].jsonData.bgColor
          });
        } else {
          PaiXuPartials.push(partials[i]);
        }
      }

      this.setData({
        PaiXuPartials: PaiXuPartials
      });
      console.log(this.PaiXuPartials);
    },

    /* 获取新闻列表数据 */
    getNewsData: function (param, ifAdd) {
      console.log("param", param);
      var that = this;

      if (!param) {
        param = {};
      }

      param.page = that.listPage.page;
      let cusUrl = getApp().globalData.AddClientUrl('/more_news_bbs_list.html', param);
      wx.request({
        url: cusUrl.url,
        header: getApp().globalData.header,
        success: function (res) {
          console.log(res);
          that.listPage.pageSize = res.data.pageSize;
          that.listPage.curPage = res.data.curPage;
          that.listPage.totalSize = res.data.totalSize;
          let tabData = [];

          if (param.page>1) {
            tabData = that.tabData;
          }
          if (res.data.result.length == 0&&param.page==1) {
            that.setData({
              tabData: null
            });
          } else {
            tabData = tabData.concat(res.data.result);
            that.setData({
              tabData: tabData
            });
          }
        },
        fail: function (res) {}
      });
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>